<template>
    <div class="addContract">
        <div>
            <van-cell-group style="text-align:left">
                <van-field
                    label-class='fw'
                    name="样品提交方式"
                    v-model="form.fsendsampletypename"
                    label="样品提交方式:"
                    @click="showFdeptClick"
                    v-validate="'required'"
                    data-vv-scope="registerForm"
                    :error="errors.has('registerForm.样品提交方式')"
                    :error-message="errors.first('registerForm.样品提交方式')"
                    required
                    readonly
                    is-link
                    placeholder="请选择样品提交方式">
                </van-field>
                <van-popup 
                    v-model="showFdept" 
                    get-container="body" 
                    position='bottom'
                >
                    <van-picker 
                        title='请选择检验类别' 
                        :columns="columns"
                        show-toolbar
                        value-key='text'
                        @cancel="onCancel4fdeptname"
                        @confirm="onConfirm4fdeptname"
                     />
                </van-popup>
                <van-field 
                    label-class='fw'
                    name="样品名称"
                    v-model="form.fsamplename"
                    label="样品名称:"
                    v-validate="'required'"
                    data-vv-scope="registerForm"
                    :error="errors.has('registerForm.样品名称')"
                    :error-message="errors.first('registerForm.样品名称')"
                    required
                    readonly
                    is-link
                    placeholder="请选择样品名称"
                />
                <van-field 
                    label-class='fw'
                    name="样品类别"
                    type="number"
                    v-model="form.fsampleclassname"
                    label="样品类别:"
                    v-validate="'required'"
                    data-vv-scope="registerForm"
                    :error="errors.has('registerForm.样品类别')"
                    :error-message="errors.first('registerForm.样品类别')"
                    required
                    readonly
                    is-link
                    placeholder="请选择样品类别"
                />
                <van-field label-class='fw' v-model="form.fsamplebrand" label="样品品牌:" placeholder="请输入样品品牌"/>
                <van-field label-class='fw'  v-model="form.fregisterbrand" label="注册商标:" placeholder="请输入注册商标"/>
                <van-field label-class='fw'  v-model="form.fdeptname_prod" label="生产企业:" placeholder="请输入生产企业"/>
                <van-field label-class='fw'  v-model="form.fspec" label="包装规格:" placeholder="请输入包装规格"/>
                <van-field label-class='fw'  v-model="form.fbatch" label="产品批号:" placeholder="请输入产品批号"/>
                <van-field label-class='fw' v-model="form.flabel"  label="标签标识:" placeholder="请输入标签标识"/>
                <van-field 
                    label-class='fw' 
                    v-model="form.fnumber" 
                    name="样品数量" 
                    label="样品数量:" 
                    v-validate="'required'"
                    data-vv-scope="registerForm"
                    :error="errors.has('registerForm.样品数量')"
                    :error-message="errors.first('registerForm.样品数量')"
                    required
                    placeholder="请选择样品数量"
                />
                <van-field 
                    label-class='fw' 
                    v-model="form.funitname"  
                    label="计量单位:" 
                    name="计量单位" 
                    v-validate="'required'"
                    data-vv-scope="registerForm"
                    :error="errors.has('registerForm.计量单位')"
                    :error-message="errors.first('registerForm.计量单位')"
                    required
                    readonly
                    is-link
                    placeholder="请选择计量单位"
                />
                <van-field 
                    label-class='fw' 
                    v-model="form.fsampledescribe"  
                    label="样品描述:" 
                    name="计量单位" 
                    v-validate="'required'"
                    data-vv-scope="registerForm"
                    :error="errors.has('registerForm.样品描述')"
                    :error-message="errors.first('registerForm.样品描述')"
                    required
                    placeholder="请选择样品描述"
                />

                <van-field
                    label-class='fw'
                    name="样品存储条件"
                    v-model="form.fsamplesavecondname"
                    label="样品存储条件:"
                    @click="showSavecond"
                    v-validate="'required'"
                    data-vv-scope="registerForm"
                    :error="errors.has('registerForm.样品存储条件')"
                    :error-message="errors.first('registerForm.样品存储条件')"
                    required
                    readonly
                    is-link
                    placeholder="请选择样品存储条件">
                </van-field>
                <van-popup 
                    v-model="savecond" 
                    get-container="body" 
                    position='bottom'
                >
                    <van-picker 
                        title='请选择存储条件' 
                        :columns="columnsSave"
                        show-toolbar
                        value-key='text'
                        @cancel="onCancel4Cond"
                        @confirm="onConfirm4Cond"
                     />
                </van-popup>
                <van-field
                    label-class='fw'
                    name="余样处理"
                    v-model="form.fleftsampleresultname"
                    label="余样处理:"
                    @click="showLeft"
                    v-validate="'required'"
                    data-vv-scope="registerForm"
                    :error="errors.has('registerForm.余样处理')"
                    :error-message="errors.first('registerForm.余样处理')"
                    required
                    readonly
                    is-link
                    placeholder="请选择余样处理">
                </van-field>
                <van-popup 
                    v-model="leftdailog" 
                    get-container="body" 
                    position='bottom'
                >
                    <van-picker 
                        title='请选择存储条件' 
                        :columns="columnsLeftsample"
                        show-toolbar
                        value-key='text'
                        @cancel="onCancel4Left"
                        @confirm="onConfirm4Left"
                     />
                </van-popup>
            </van-cell-group>
        </div>
        <div class='step2Footer' >
            <div class='pre' @click="pre">上一步</div>
            <div class='next' @click="next">下一步</div>
        </div>
    </div>
</template>

<script>
import {
    searchfcode
    ,insertsamplereport
    ,searchbyid
    ,updatesamplereport
} from '@/api/addSampleBill'
import { 
    Field
    ,DatetimePicker
    , Popup
    ,Cell
    ,CellGroup
    ,Picker
    ,Toast
} from 'vant';
export default {
    name: 'addContract',
    components: {
        [Cell.name]:Cell,
        [CellGroup.name]:CellGroup,
        [Field.name]:Field,
        [DatetimePicker.name]:DatetimePicker,
        [Popup.name]:Popup,
        [Picker.name]:Picker,
    },
    created(){
        this.state = this.$route.query.state
        if(this.state == 'add'){
            this.getCode()
            //this.searchColumns()
        }else if(this.state == 'edit'){
            this.form.fcontractid = this.$route.query.fsamplereportid
            this.getEdit(this.form.fsamplereportid)
        }else if(this.state == 'view'){
            this.form.fcontractid = this.$route.query.fsamplereportid
            this.getEdit(this.form.fsamplereportid)
        }
    },
    data () {
        return {
            leftdailog:false,
            savecond:false,
            state:'',
            text:'',
            minDate: new Date(2020, 0, 1),
            maxDate: new Date(2025, 10, 1),
            currentDate: new Date(),
            showTime:false,
            showFdept:false,
            form:{
                fsamplereportid:'',
                fstep:'2',
                fsendsampletypename:'',
                fsendsampletype:'',
                fsamplename:'',
                fsampleid:'',
                fsampleclassname:'',
                fsampleclassid:'',
                fdeptname_prod:'',
                fdeptid_prod:'',
                fspec:'',
                fbatch:'',
                fnumber:'',
                funitname:'',
                funitid:'',
                fsampledescribe:'',
                fsamplesavecondname:'',
                fsamplesavecond:'',
                fleftsampleresultname:'',
                fleftsampleresult:'',



            },
            columns: [
                { text: '送样',id:'1'},
                { text: '抽样',id:'2' },
                { text: '特快专递',id:'3' },
                { text: '普通邮寄',id:'5' }
            ],
            columnsSave:[
                { text: '常温',id:'1'},
                { text: '冷藏',id:'2' },
                { text: '冷冻',id:'3' }
            ],
            columnsLeftsample:[
                { text: '委托承检方处理',id:'1'},
                { text: '委托方自己取回',id:'2' }
            ]
          
        }
    },
    methods:{
        pre(){
            this.$router.push({path:"/addSampleBill"});
        },
        next(){
            this.$validator.validateAll('registerForm').then((valid) => {
                console.log(valid)
                if (valid) {
                    updatesamplereport(this.form).then(res=>{
                        if(res.isSuccess){
                        }
                    })
                    this.$router.push({path:"/addSampleBill3"});
                }
            })
        },
        showLeft(){
            this.leftdailog = true
        },
        onCancel4Left(){
            this.leftdailog = false
        },
        onConfirm4Left(val){
            this.form.fleftsampleresultname = val.text
            this.form.fleftsampleresult = val.id
            this.leftdailog = false
        },
        showSavecond(){
            this.savecond = true
        },
        onCancel4Cond(){
            this.savecond = false
        },
        onConfirm4Cond(val){
            this.form.fsamplesavecondname = val.text
            this.form.fsamplesavecond = val.id
            this.savecond = false
        },
        searchColumns(){
            searchforwx().then(res=>{
                if(res.isSuccess){
                    this.columns = res.rows.filter(function(value) {return value.fstate ==1;})
                }
            })
        },
        getEdit(fsamplereportid){
            searchbyid({
                fsamplereportid:fsamplereportid
            }).then(res=>{
                console.log(res)
               
               
            })
        },
        formatter(type, val) {
            if (type === 'year') {
                return `${val}年`;
            } else if (type === 'month') {
                return `${val}月`
            } else if (type === 'day') {
                return `${val}日`
            }
            return val;
        },
 
        save(){
            this.$validator.validateAll('registerForm').then((valid) => {
                console.log(valid)
                if (valid) {
                    if(this.state == 'add'){
                        insertsamplereport(this.form).then(res=>{
                            if(res.isSuccess){
                                Toast('保存成功');
                                this.$router.push({path:"/"});
                            }
                        })
                    }else if(this.state == 'edit'){ 
                        edit(this.form).then(res=>{
                            if(res.isSuccess){
                                Toast('修改成功');
                                this.$router.push({path:"/"});
                            }
                        })
                    }
                }
            })

        },
        getCode(){
            searchfcode({}).then(res=>{
                if(res.isSuccess){
                    console.log(res)
                    this.form.fsamplereportcode = res.object
                }
            })
        },
        showTimeClick(){
            this.showTime = true
        },
        timeConfirm(val){
            this.form.fcontractdate = this.dateToString(val)
            this.showTime = false
        },
        timecancel(){
            this.showTime = false
        },
        showFdeptClick(){
            this.showFdept = true
        },
        onCancel4fdeptname(val){
            this.showFdept = false
        },
        onConfirm4fdeptname(val){
            console.log(val)
            this.form.fsendsampletypename = val.text
            this.form.fsendsampletype = val.id
          
            this.showFdept = false
        },
        dateToString(date){ 
            var year = date.getFullYear(); 
            var month =(date.getMonth() + 1).toString(); 
            var day = (date.getDate()).toString();  
            if (month.length == 1) { 
                month = "0" + month; 
            } 
            if (day.length == 1) { 
                day = "0" + day; 
            }
            var dateTime = year + "-" + month + "-" + day;
            return dateTime; 
        },
    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style>
.faddContractFooter{
    position: fixed;
    left:0;
    bottom:0;
    width:100%;
    height: 40px;
    display: flex;
    flex: 1
}
.leftBtn4addContract{
    line-height: 40px;
    width:100%;
    text-align: center;
    background-color: #07c160;
    color:white;
}
.rightBtn4addContract{
    line-height: 40px;
    width:50%;
    text-align: center;
    background-color: #1989fa;
    color:white;  
}
.fw{
    font-weight: 700
}
.lang{
    width:120px
}
.step2Footer{
    width:100%;
    height: 40px;
    line-height: 40px;
    position: fixed;
    bottom: 0;
    left:0;
    color: white;
    display: flex
}
.pre{
    background: #07c160;
    width: 50%;
}
.next{
    background:  #1989fa;
    width: 50%;
}
</style>
